<link rel="stylesheet" href="__CDN__/assets/addons/calendar/fullcalendar/dist/fullcalendar.css">
<style>
    .fc-day.selected {
        background: #e0f2be !important;
    }

    .fc-event.fc-completed {
        text-decoration: line-through;
    }

    .fc-event.fc-expired {
        background: #999 !important;
        border-color: #999 !important;
    }

    .calendar-trash {
        position: absolute;
        top: 0;
        left: 0;
        display: inline-block;
        width: 100%;
        height: 52px;
        text-align: center;
        line-height: 52px;
        color: #e74c3c;
        background-color: #f2dede;
        display: none;
    }

    .fc .fc-toolbar .calendar-trash .fa {
        font-size: 20px;
        display: inline-block;
        vertical-align: middle;
    }

    .fc .fc-toolbar .calendar-trash > * {
        float: none
    }

    body .dialog-event .layui-layer-content {
        padding: 15px;
    }

    #add-form .msg-box {
        position: absolute;
        top: -25px;
        right: 0;
    }

    #add-form.n-default .msg-wrap {
        position: relative;
    }

    ul.fc-color-picker li a {
        position: relative;
    }

    ul.fc-color-picker li a.active:after {
        font-family: FontAwesome;
        content: "\f00c";
        position: absolute;
        z-index: 1000;
        top: 4px;
        left: 7px;
        font-size: 11px;
        color: #fff;
    }

    .external-event a {
        color: #fff;
    }

    body {
        height: auto;
    }
</style>
<style data-render="darktheme">
    body.darktheme .box-header.with-border {
        color: #ccc;
        border-color: #404040;
    }

    body.darktheme .fc-unthemed th, body.darktheme .fc-unthemed td, body.darktheme .fc-unthemed thead,
    body.darktheme .fc-unthemed tbody, body.darktheme .fc-unthemed .fc-divider,
    body.darktheme .fc-unthemed .fc-row, body.darktheme .fc-unthemed .fc-content,
    body.darktheme .fc-unthemed .fc-popover, body.darktheme .fc-unthemed .fc-list-view,
    body.darktheme .fc-unthemed .fc-list-heading td {
        border-color: #262626;
    }

    body.darktheme .fc-state-default {
        filter: invert(1) hue-rotate(180deg);
        background-image: none;
        box-shadow: none;
    }

    body.darktheme .fc-widget-header {
        background-color: #262626;
    }

    body.darktheme .fc-unthemed td.fc-today {
        background-color: #262626;
    }
</style>
<div class="panel panel-default panel-intro">


    <div class="panel-body">
        <div id="myTabContent" class="tab-content">
            <div class="tab-pane fade active in" id="one">
                <div class="widget-body no-padding" id="calendar"></div>
            </div>

        </div>
    </div>
</div>

<script type="text/html" id="dayrighttpl">
    <ul class="dropdown-menu fullcalendar-contextmenu" id="dayrightmenu">
        <li role="presentation"><a role="menuitem" tabindex="-1" href="#" data-date="<%=date%>" data-action="add">添加任务</a></li>
    </ul>
</script>
